<template>
    <div id="app">
        <nav>
            <router-link v-for="item in menus" :to="item.path" :key="item.path" >{{item.name}}</router-link>
        </nav>
        <router-view/>
    </div>
</template>

<script>
import axios from "axios";

export default {
    data() {
        return {
            menus:[]
        }
    },
    created() {
        // 登录之后
        // 获取菜单的信息
        axios.get("http://127.0.0.1:4523/m1/2978669-0-default/menu").then(res => {
            this.menus = res.data.menus
            this.menus.forEach(item=>{
                this.$router.addRoute({
                    name:item.name,
                    path:item.path,
                    component: () => import(/* webpackChunkName: "about" */ `@/views${item.path}.vue`)
                })
            })
        })
    }
}
</script>

<style lang="less">
body {
  margin: 0;
  padding: 0;
}

#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
}

nav {
  padding: 30px;

  a {
    font-weight: bold;
    color: #2c3e50;

    &.router-link-exact-active {
      color: #42b983;
    }
  }
}
</style>
